'use strict';

const xhr2 = new XMLHttpRequest();
const date = new Date();
let wordBox = document.querySelector('.word_box');

window.addEventListener('load', () => {
    let promise = new Promise((resolve, reject) => {
        xhr2.open('get', '/get_word', true);
        xhr2.send();
        xhr2.onreadystatechange = () => {
            if (xhr2.readyState === 4 && xhr2.status === 200) {
                if (xhr2.responseText === 'no') {
                    alert('加载失败！');
                    return;
                }
                let obj = JSON.parse(xhr2.responseText);
                for (let i = 0; i < obj.infoArr.length; i++) {
                    if (obj.infoArr[i]) {
                        wordBox.innerHTML += `<article data-id="${obj.infoArr[i].id}">
                        <p class="context">${obj.infoArr[i].context}</p>
                        <p class="date">${obj.infoArr[i].update}</p>
                      </article>`;
                    }
                    resolve();
                }
            }
        }
    })
    promise.then((value) => {
        let div = document.createElement('div');
        div.className = 'null2 type_page';
        wordBox.appendChild(div);
    }).catch((reason) => {
        console.error(reason);
    })
})

//上传时间
class SubmitTime {
    time() {
        if (date.getMinutes() < 10) {
            this.M = '0' + date.getMinutes();
        } else {
            this.M = date.getMinutes();
        }
        let sT = `${date.getFullYear()}/${date.getMonth() + 1}/${date.getDate()}--${date.getHours()}:${this.M}`;
        return sT;
    }
}

class SubmitWord {
    constructor() {
        this.go = document.querySelector('#go');
        this.word = document.querySelector('#word');
        this.submit();
    }

    submit() {
        this.go.onclick = () => {
            if (this.word.value === '') {
                return;
            }
            // this.null2 = document.querySelector('.null2');
            // this.addId = parseInt(this.null2.previousElementSibling.getAttribute('data-id')) + 1;
            this.addId = parseInt(wordBox.firstElementChild.getAttribute('data-id')) + 1;
            this.obj = {
                id: this.addId.toString(),
                title: "",
                context: this.word.value.replace(/\n/g, '<p>'),
                imgUrlBase64: "",
                update: st.time()
            }
            console.log(this.obj);
            xhr2.open('post', '/create_word', true);
            xhr2.setRequestHeader('Content-Type', 'application/json');
            xhr2.send(JSON.stringify(this.obj));
            xhr2.onreadystatechange = () => {
                if (xhr2.readyState === 4 && xhr2.status === 200) {
                    if (xhr2.responseText === 'no') {
                        alert('上传失败！');
                        return;
                    }
                    let context = document.createElement('p');
                    let date = document.createElement('p');
                    let article = document.createElement('article');
                    article.setAttribute('data-id', this.addId.toString());
                    context.innerHTML = this.word.value.replace(/\n/g, '<p>');
                    context.className = 'context';
                    date.innerHTML = st.time();
                    date.className = 'date';
                    article.appendChild(context);
                    article.appendChild(date);
                    wordBox.insertBefore(article, wordBox.firstElementChild);
                    // wordBox.insertBefore(article, this.null2);
                    this.word.value = '';
                }
            }
        }
    }
}

const st = new SubmitTime();
new SubmitWord();